<template>
    <div>
        <hd-tab :tabs="tabs"></hd-tab>

        <el-card shadow="always" :body-style="{ padding: '20px' }">
            <div slot="header">
                模型列表
            </div>
            <el-table
                :border="true"
                :data="form"
                style="width: 100%">
                <el-table-column
                    prop="id"
                    label="ID"
                    width="180">
                </el-table-column>
                <el-table-column
                    prop="title"
                    label="名称"
                    width="180">
                </el-table-column>
                <el-table-column
                    #default="{row:r}"
                    label="创建时间"
                >
                    {{ r.created_at | dateFormat() }}
                </el-table-column>
                <el-table-column
                    label="操作"
                    #default="{row:r}"
                >
                    <el-button-group>
                        <el-button type="success" size="small" @click="router('admin.article.edit', { id: r.id })">编辑</el-button>
                        <el-button type="danger" size="small" @click="Del(r)">删除</el-button>
                        <el-button type="primary" size="small" @click="router('admin.field.index',{id:r.id})">字段管理</el-button>
                    </el-button-group>
                </el-table-column>
            </el-table>
        </el-card>
    </div>
</template>

<script>
import tabs from './tabs'

export default {
    route: {name: 'admin.article.index',meta:{title:'模型列表'}},
    data() {
        return {
            form: [],
            tabs
        }
    },
    async created() {
        this.form = await this.axios.get('admin/article')
    },
    methods: {
        Del(r) {
            this.$confirm(`确定删除【${r.title}】?`, '温馨提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'error'
            }).then(async () => {
                await this.axios.delete(`admin/article/${r.id}`)
                this.form.splice(this.form.indexOf(r), 1)
            })
        },

    }
}
</script>

<style scoped>

</style>
